<template>
  <div>
    <pie-chart
      :height="height"
      :optionSeries="informationEmotionDistribution"
      :optionLegend="informationEmotionDistributionOptionLegend"
      :saveImage="true"
      @getBase64Image="getBase64Image"
    />
  </div>
</template>
<script>
  import {
    getEmotionDistribution,
  } from "@/api/system/reportGenerate";
  import PieChart from '@/components/Echarts/Generate/PieChart'

export default {
  props: {
    eventId: {
        type: Number,
        default: 0
      },

  },
  data() {
    return {
      informationEmotionDistribution: [],
      informationEmotionDistributionOptionLegend: [],
      height: "476px",
      loading: true,

    }
  },
  components:{
    PieChart,
  },
  computed: {
  },
  watch: {},
  mounted() {
    this.getEmotionDistribution()
  },
  created() {

  },
  methods: {
    getBase64Image(val) {
      this.$emit('getBase64Image', val)
    },

    getEmotionDistribution() {
      this.loading = true;
      getEmotionDistribution(this.eventId).then(response => {
        this.loading = false;
        //信息情感分布
        let informations = response.data
        let informationDatas = []
        Object.keys(informations).forEach(key => {
          if (key == "positive") {
            let obj = {
              name: "正面",
              value: informations[key]
            }
            informationDatas.push(obj);
            this.informationEmotionDistributionOptionLegend.push("正面")
          } else if (key == "negative") {
            let obj = {
              name: "负面",
              value: informations[key]
            }
            informationDatas.push(obj);
            this.informationEmotionDistributionOptionLegend.push("负面")
          } else if (key == "neutral") {
            let obj = {
              name: "中性",
              value: informations[key]
            }
            informationDatas.push(obj);
            this.informationEmotionDistributionOptionLegend.push("中性")
          }
        })
        this.informationEmotionDistribution = [
          {
            name: '舆情数',
            type: 'pie',
            radius: '50%',
            data: informationDatas,
            emphasis: {
              itemStyle: {
                shadowBlur: 10,
                shadowOffsetX: 0,
                shadowColor: 'rgba(0, 0, 0, 0.5)'
              }
            }
          }
        ]

      });
    },

  }
}
</script>

